.warning {
  background-color: #fffbe6;
  border: 1px solid #ffe58f;
}
.alert {
  box-sizing: border-box;
  margin: 0;
  color: #000;
  font-size: 14px;
  font-variant: tabular-nums;
  line-height: 1.5715;
  list-style: none;
  font-feature-settings: "tnum";
  position: relative;
  display: flex;
  align-items: center;
  padding: 8px 15px;
  word-wrap: break-word;
  border-radius: 2px;
}
.alert a {
  color: #333;
  text-decoration: none;
  background-color: transparent;
  outline: none;
  cursor: pointer;
  transition: color 0.3s;
}
.form {
  margin-bottom: 16px;
  background: #fff;
  padding: 24px 12px;
  display: flex;
  flex-direction: column;
}
.form .ipt {
  width: 254px;
  height: 40px;
}
.form .btns {
  display: flex;
  flex-direction: row-reverse;
}
.form .btns button {
  margin: 0 10px;
}
.content {
  background: #fff;
  padding: 24px 12px;
}
.content .list {
  display: flex;
  flex-wrap: wrap;
}
.content .list .item {
  width: 25%;
  text-align: center;
  max-width: 25%;
  margin-bottom: 10px;
}
.content .list .item img {
  height: 180px;
}
.content .page {
  margin-top: 1.5rem;
  display: flex;
  flex-direction: row-reverse;
}
.content .page > div {
  display: flex;
}
.content .page > div > span {
  line-height: 28px;
  margin-right: 10px;
}
.maskImg {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 360px;
  margin-bottom: 12px;
  color: #888;
  background-color: #f5f5f5;
  overflow: hidden;
}
.maskImg > img {
  position: absolute;
  top: 50%;
  left: 50%;
  height: 100%;
  width: 100%;
  transform: translate3d(-50%, -50%, 0);
  object-fit: cover;
}
.maskBtn {
  margin-left: 400px;
}
.maskBtn button {
  margin-left: 10px;
}
